<template>
  <div></div>
</template>

<script setup>
import mapboxgl from "mapbox-gl";
import { inject, onMounted } from "vue";

onMounted(() => {
  const $map = inject("$map");
  console.log($map);
  $map.addControl(new mapboxgl.FullscreenControl());
  const nav = new mapboxgl.NavigationControl({
    //是否显示指南针按钮，默认为true
    showCompass: true,
    //是否显示缩放按钮，默认为true
    showZoom: true,
  });
  //添加导航控件，控件的位置包括'top-left', 'top-right','bottom-left' ,'bottom-right'四种，默认为'top-right'
  $map.addControl(nav, "top-left");
});
</script>

<style scoped></style>
